<template>
 

  <div class="welding-data">
    <div class="head-left">
     </div>
    <div class="welding-head">
      <date-view />
      <div class="head-center">
        <div class="name">
        
          <img :src="initProject.logo | imgPath" style="width: 56px; margin-right: 10px; vertical-align: middle">
          <a href="javascript:;" @click="download(initProject.construction)">{{ initProject.screenName}}</a>
        </div>
      </div>
      <div class="head-right">
        <div class="right-block">
          <div class="user">
            <div class="media">
              <div class="media-left">
                <el-avatar :src="avatar | imgPath" size="medium" />
              </div>
              <div class="media-body">
                <div class="name" style="margin-top: 10px">{{ name }}</div>
                <div class="info">
                  <el-dropdown>
                    <span class="el-dropdown-link name">
                      <i class="el-icon-arrow-down el-icon--right" />
                    </span>
                    <el-dropdown-menu slot="dropdown">
                      <el-dropdown-item>
                        <span style="display: block" @click="logout">{{
                          $t("navbar.logOut")
                        }}</span>
                      </el-dropdown-item>
                    </el-dropdown-menu>
                  </el-dropdown>
                </div>
              </div>
            </div>
          </div>
    
          <div class="set" style="height: 40px; line-height: 40px">
            <label  @click="screenMonitor">
              < 返回</label> </div> </div> </div> </div> <div class="welding-container clearfix">
      <div class="welding-left">
        <el-select
          v-model="value"
          placeholder="可切换其他项目"
          filterable
          clearable
          class="tabsProject"
          @change="onChangProject"
        >
          <el-option
            v-for="(item, index) in options"
            :key="index"
            :label="item.name"
            :value="item.id"
          />
        </el-select>
        <!-- 项目信息 -->
        <project-info :obj="initProject" />
        <!-- 工艺信息 -->
        <process-information :equip-code="equipCode" :new-space-id="newSpaceId" />
        <el-tabs v-model="activeName">
          <el-tab-pane label="报警事件" name="first" lazy>
            <equipment-alarm :new-space-id="newSpaceId" />
          </el-tab-pane>
          <el-tab-pane label="巡检事件" name="second" lazy>
            <patrol-data :new-space-id="newSpaceId" />
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="welding-mid">
        <!-- 视频展示 --->
        <video-show indexx="1" :new-space-id="newSpaceId" />
        <!-- <video-show indexx="2" class="in2" :new-space-id="newSpaceId" /> -->
        <!-- 轮播 -->
        <mid-block2 :new-space-id="newSpaceId" @on-data="getMonitoring" @on-change="setData" />
      </div>
      <div class="welding-right">
        <!-- 时间展示 -->
        <date-show :new-space-id="newSpaceId" />
        <!-- 安全监测 -->
       <safety-monitoring></safety-monitoring>
       <safety-monitoring />
        <!-- 人员统计 -->
        <personnel-statistics :new-space-id="newSpaceId" />
        <!--- 生产计划 --->
        <production-plan :new-space-id="newSpaceId" />
      </div>
    </div>
    <!--    <p style="font-size: 14px; color:#fff; height: 20px; text-align: center; padding: 20px">恩科机电设备有限公司版权所有</p>-->
 
    <el-dialog :visible.sync="dialogTableVisible" width="80%" append-to-body> 
   
   <div>
     <object :data="pdfSrc" type="application/pdf" width="100%" height="1080px;">
       <p>您的浏览器不支持嵌入 PDF 文件，请使用下载链接查看该文件。</p>
     </object>
   </div>
  
</el-dialog>
  </div>

</template>

<script>
import {
  mapGetters
} from 'vuex'
import {
  postHandle
} from '@/api'
import VideoShow from './components/VideoShowCS1'
// import MidBlock2 from './components/MidBlock2'
import MidBlock2 from './components/MidBlock2'
import ProductionPlan from './components/ProductionPlan'
import DateShow from './components/DateShow'
import PatrolData from './components/PatrolData'
import EquipmentAlarm from './components/EquipmentAlarm'
import PersonnelStatistics from './components/PersonnelStatistics'
import ProjectInfo from './components/ProjectInfo'
import ProcessInformation from './components/ProcessInformation'
import DateView from '../screen/components/date-view'
 
// import SafetyMonitoring from "@/pages/project/views/screen2/components/SafetyMonitoring.vue";
export default {
  name: 'Notice',
  
  name: 'ProjectScreen',

  components: {
   
    // SafetyMonitoring,
    DateView,
    ProcessInformation,
    ProjectInfo,
    PersonnelStatistics,
    EquipmentAlarm,
    PatrolData,
    DateShow,
    ProductionPlan,
    MidBlock2,
    VideoShow
  },

  data() {
    return {
      timer:null, //定时器名称
      newObject: {},
      newSpaceId: '',
      activeName: 'first',
      monitoringData: {},
      equipCode: null,
      options: [],
      value: '',
      pdfSrc:"",
      dialogTableVisible:false,
      noticeList: [],
 
        animate:false,
        intNum: undefined,
    }
  },

  computed: {
    ...mapGetters(['avatar', 'name']),
    object() {
      return this.$store.state.project.object
    },
    initProject() {
      return JSON.stringify(this.newObject) === '{}'
        ? this.object
        : this.newObject
    },
    optionLeft() {
      return {
        step: 0.4, //
        direction: 1  ,
        limitMoveNum:4
      }
    }
  },

  watch: {
    value(v) {
      let obj = this.options.find((item) => item.id === v)
      this.newObject = obj
      this.newSpaceId = obj.spaceId
      this.getNoticeData();
    },
  },

  created:function () {
    //location.reload();
    //this.$router.go(0)
    this.setTime();
    this.getNoticeData();

  },

  mounted() {
    this.getProjectList()
  },

  methods: {
    setTime(){ 
　　//每隔一分钟运行一次保存方法
      this.timer = setInterval(()=>{
        this.getNoticeData();
      },6000)
    },

    screenMonitor() {
      //setSpaceId(row.spaceId)
      window.location.href = '/project'
    },
    getNoticeData() {
    
      var date = new Date();
    var year = date.getFullYear(); //月份从0~11，所以加一
    let month = date.getMonth();
    
    var dateArr = [
        date.getMonth() + 1,
        date.getDate(),
        date.getHours(),
        date.getMinutes(),
        date.getSeconds(),
    ];
    //如果格式是MM则需要此步骤，如果是M格式则此循环注释掉
    for (var i = 0; i < dateArr.length; i++) {
        if (dateArr[i] >= 1 && dateArr[i] <= 9) {
            dateArr[i] = "0" + dateArr[i];
        }
    }
    var strDate =
        year +
        "-" +
        dateArr[0] +
        "-" +
        dateArr[1]
      postHandle(

      "/api/v1/welder-sbtx-second/eq-alarm-comb/getList",
        {
          
          d: {
            fields: [
              {
                name: "userInfo", // 返回用户拥有的角色
              },
              {
                name: "deviceInfo", // 返回用户拥有的角色
              },
              {
                name: "disposeRecord",
              },
            ],
            filters: [
              {
                field: "spaceId",
                operator: "EQUALS",
                value: this.newSpaceId || this.spaceId,
              },
              {
                field: "gjtime",
                operator: "LIKE",
                value:  strDate
              },
              {
                field: "st",
                operator: "EQUALS",
                value:  1
              },{
              field: "bjlx",
              operator: "IN",
              values: [2004,2005,2006,2007],
            }
              // {
              //   field: "status",
              //   operator: "EQUALS",
              //   value: 2,
              // },
            ],
            page: {
              ps: 20,
            },
            sorts: [{ field: "alramTime", isDesc: true }],
          },
        }
      ).then((res) => {
        this.newsList = res.result;
       
      });
        // this.$http.get('/news/allList', {
        //   params: {
        //     'pageNumber': 10,
        //     'currentPage': 1
        //   }
        // }).then(res => {
         
        // });

       // this.newsList = ["asdsadsadkowqndksandas","阿斯顿撒旦撒旦撒都快三点卡萨丁奶萨卡迪那萨卡人"]
          // this.ScrollUp();
      },
      
    download(url){
      if(url===null||url.length<20){
        this.$message({
              type: 'info',
              message: '未找到该项目方案资料！'
            })
      }else{
        this.pdfSrc="http://127.0.0.1:82/welder-second/upload/"+url;
        this.dialogTableVisible=true;
      }
    
    
      
      // const routeData = this.$router.resolve({
      //   name: 'pdfreade',
      //   params:{
      //     pdfSrc: url,
      //   }
      // });
      // window.open(routeData.href, "_blank");
 
   
    },
    getProjectList() {
      let params = {
        d: {
          
            filters: [
              {
                "field": "entSpaceId",
                "operator": "EQUALS",
                "value":this.$store.getters.entSpaceId
              }, {
                "field": "st",
                "operator": "NE",
                "value": 9
              }
            ],
         
          page: {
            p: 1,
            ps: 99999
          }
        }
      }
      postHandle('/api/v1/welder-sbtx-second/project-info-comb/list', params).then(
        (res) => {
          this.options = res.result
        }
      )
    },
    onChangProject() {
      this.getProjectList()
    },
    getMonitoring(obj) {
      this.monitoringData = obj
    },
    getProjectInfo(obj) {
      this.object = obj
    },
    setData(obj) {
      if (obj && obj.gatewayEquipmentList && obj.gatewayEquipmentList.length > 0 && obj.gatewayEquipmentList[0].hjEquipmentInfo) {
        this.equipCode = obj.gatewayEquipmentList[0].hjEquipmentInfo.serialNum
      }
    },
    async logout() {
      await this.$store.dispatch('user/logout')
      this.$router.push(`/login`)
    }
  }
}
</script>

<style lang="scss" scoped>
.in2{
  background-color: red;
}
  ::v-deep .tabsProject {
    width: 100%;
    margin: 20px 0;

    .el-input__inner {
      background: transparent;
    }
  }
  .head-left{

  }
  .seamless-warp2 {
  margin-left: 36%;
        overflow: hidden;
        height: 60px;
      line-height: 60px !important;
        width: 50%;
        ul.item {
            width: 100%;
            li {
                float: left;
                color: red;
            
                margin-right: 10px;
            }
        }
    }
    .text-ellipsis {
      color: red;
    }
</style>
